// Name:            JS Plugins helpers
//
// Description:     JS Components helper classes
//
// =============================================================================


/* ==========================================================================
   Component: JS Plugins helpers
 ============================================================================ */

// -----------------------------------------------------------------------------
// helpers
// -----------------------------------------------------------------------------

.am-fade {
  opacity: 0;
  .transition(opacity .2s linear);
  &.am-in {
    opacity: 1;
  }
}

.am-collapsed {
}

.am-collapse {
  display: none;

  &.am-in {
    display: block;
  }
  tr&.am-in {
    display: table-row;
  }
  tbody&.am-in {
    display: table-row-group;
  }
}

.am-collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  .transition(height .3s ease);
}

// -----------------------------------------------------------------------------
// Sticky plugin
// -----------------------------------------------------------------------------

.am-sticky {
  position: fixed !important;
  z-index: @z-index-sticky;
  .transform-origin(0 0); // Needed for scale animation
}

[data-am-sticky][class*='am-animation-'] {
  -webkit-animation-duration: .2s;
  animation-duration: .2s;
}

.am-sticky-bottom {}


// -----------------------------------------------------------------------------
// Dimmer plugin
// -----------------------------------------------------------------------------

// hide scroll bar when dimmer active
.am-dimmer-active {
 overflow: hidden;
}

.am-dimmer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .6);
  z-index: @z-index-dimmer;
  opacity: 0;
  .transition(opacity .15s);

  &.am-active {
    opacity: 1;
  }
}


// -----------------------------------------------------------------------------
// Style for collapse plugin
// -----------------------------------------------------------------------------

[data-am-collapse] {
  cursor: pointer;
}